<template>
  <div class="senior">

    <!-- 1.单行文本组件 type = text  -->
    <DrugBaseInput 
      v-if="componentsObject.type === 'DrugBaseInput'" 
      :componentsObject="componentsObject"
      @childValueCome="childValueCome"
      ref="drugComponent">
    </DrugBaseInput>
    
    <!-- 2.文本域组件 type = textarea -->
    <DrugBaseTextarea
      v-if="componentsObject.type === 'DrugBaseTextarea'" 
      :componentsObject="componentsObject" 
      @childValueCome="childValueCome"
      ref="drugComponent">
    </DrugBaseTextarea>
    
    <!-- 3.数字框组件 type = number -->
    <DrugBaseNumber 
      v-if="componentsObject.type === 'DrugBaseNumber'" 
      :componentsObject="componentsObject" 
      @childValueCome="childValueCome"
      ref="drugComponent">
    </DrugBaseNumber>

  </div>
</template>


<script>

// （1）基础单行文本组件
import DrugBaseInput from '../drugForm/DrugBaseInput'
// （2）基础数字输入框组件
import DrugBaseNumber from '../drugForm/DrugBaseNumber'
// （3）基础文本域输入框组件
import DrugBaseTextarea from '../drugForm/DrugBaseTextarea'

export default {
  name: 'ModifyForm',
  props:{
    componentsObject: Object
    /**
     * componentsObject:{
     *  title: '标题',         //  汉语标题
     *  keys: 'test',          //  英文字段名称
     *  placeholder: '请输入', //  placeholder 
     *  type: 'text',          //  类型
     *  value: '万三',         //  值  
     * } 
     */
  },
  components:{
    DrugBaseInput,
    DrugBaseNumber,
    DrugBaseTextarea
  },
  data(){
    return{
      
    }
  },


  watch:{
    '$store.getters.checkFormTransform': function(){
      this.$nextTick(()=>{
        this.$refs.drugComponent.handleSubmit();
      })
    }
  },

  methods: {
    // 作为中间的跳板进行数据传输
    childValueCome(e){
      this.$emit("formValidateResult", e)
    }
  }
}
</script>


<style lang="less" scoped>

</style>
